<html>
<head>
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script language="JavaScript" type="text/javascript">
        <!--
        function swapContent(cv) {
            $("#myDiv").html('Loading gif here').show();
            var url = "model/mymodel.php";
            $.post(url, {contentVar: cv} ,function(data) {
                $("#myDiv").html(data).show();
            });
        }
        //-->
    </script>
    <style type="text/css">
        #myDiv{
            width:200px; height:150px; padding:12px;
            border:#666 1px solid; background-color:#FAEEC5;
            font-size:18px;
        }
    </style>
</head>
<body>
<a href="#" onClick="return false" onmousedown="javascript:swapContent('con1');">Content1</a>
<a href="#" onClick="return false" onmousedown="javascript:swapContent('con2');">Content2</a>
<a href="#" onClick="return false" onmousedown="javascript:swapContent('con3');">Content3</a>
<div id="myDiv">My default content for this page element when the page initially loads</div>
</body>
</html>
